﻿<%-- The following 4 lines are ASP.NET directives needed when using SharePoint components --%>
<%@ Page Inherits="Microsoft.SharePoint.WebPartPages.WebPartPage, Microsoft.SharePoint, Version=15.0.0.0, Culture=neutral, PublicKeyToken=71e9bce111e9429c" MasterPageFile="~masterurl/default.master" language="C#" %>
<%@ Register Tagprefix="WebPartPages" Namespace="Microsoft.SharePoint.WebPartPages" Assembly="Microsoft.SharePoint, Version=15.0.0.0, Culture=neutral, PublicKeyToken=71e9bce111e9429c" %>
<%@ Register Tagprefix="SharePoint" Namespace="Microsoft.SharePoint.WebControls" Assembly="Microsoft.SharePoint, Version=15.0.0.0, Culture=neutral, PublicKeyToken=71e9bce111e9429c" %>
<%@ Register Tagprefix="Utilities" Namespace="Microsoft.SharePoint.Utilities" Assembly="Microsoft.SharePoint, Version=15.0.0.0, Culture=neutral, PublicKeyToken=71e9bce111e9429c" %>
<%@ Register Tagprefix="WebPartPages" Namespace="Microsoft.SharePoint.WebPartPages" Assembly="Microsoft.SharePoint, Version=15.0.0.0, Culture=neutral, PublicKeyToken=71e9bce111e9429c" %>

<asp:Content ID="ContentTitle" ContentPlaceHolderID="PlaceHolderPageTitle" runat="server">
    Help
</asp:Content>

<asp:Content ID="ContentPageTitle" ContentPlaceHolderID="PlaceHolderPageTitleInTitleArea" runat="server">
    <span id="page-help-title-area">Help</span>
</asp:Content>

<%-- The markup and script in the following Content element will be placed in the <head> of the page --%>
<asp:Content ID="Content1" ContentPlaceHolderId="PlaceHolderAdditionalPageHead" runat="server">
    <link rel="stylesheet" href="../Content/AppBack.css" />
    <script type="text/javascript" src="../Scripts/jquery-1.6.2.min.js"></script>
</asp:Content>

<%-- The markup and script in the following Content element will be placed in the <body> of the page --%>
<asp:Content ID="Content2" ContentPlaceHolderId="PlaceHolderMain" runat="server">

    <div class="help-content">

        <h2 id="about-app-part">About this App Part</h2>

        <p id="help-intro">
            The Galleriffic App is an app part to display the content of a pictures library in a dynamic and cool animated gallery.
        </p>
        
        <h2 id="how-to-manage-news">How to manage pics ?</h2>

        <p id="micro-lists-intro">
            To managed pics displayed in the app part, you can use the SharePoint pictures library available from the app home page.
            This lib is a classical SharePoint library, then you can upload pics, manage items, change titles, etc.
        </p>

        <h2 id="how-to-use">How to use Galleriffic App Part ?</h2>

        <p id="edit-carousel-add-app-part">
            To use this app in your sharepoint site (aka "app host web"), 
            you need to have an editable page (web part page or wiki page). 
            Edit the page, and click on the "Insert" tab in the ribban. Click on "App part", 
            choose the app part called "Galleriffic App Part", and finally click on "Add" button:
        </p>
        
        <img src="../Images/Help01.png" alt="App Part Help"/>

        <p id="edit-menu-modify-properties">
            When the app part is inserted, you can save and close the page edit mode, or 
            click on the app part edit menu to modify properties:
        </p>

        <img src="../Images/Help02.png" alt="App Part Help"/>
        <p>&nbsp;</p>

        <h2 id="app-part-properties">App Part properties</h2>
    
        <p id="edit-app-part-properties">When you're editing the app part properties, you can change the following custom properties:</p>

        <table>
            <thead>
                <tr>
                    <td><span id="table-property-header-name">Name</span></td>
                    <td><span id="table-property-header-category">Category</span></td>
                    <td><span id="table-property-header-type">Type</span></td>
                    <td><span id="table-property-header-description">Description</span></td>
                </tr>
            </thead>
            <tbody>
                <tr class="classical">
                    <td class="first"><span id="table-property-numthumbs">NumThumbs</span></td>
                    <td><span id="table-property-numthumbs-category">General Settings</span></td>
                    <td><span id="table-property-numthumbs-type">Integer</span></td>
                    <td><span id="table-property-numthumbs-description">Indicates the number of thumbs to display by page. The default value is 15.</span></td>
                </tr>
                <tr class="alternate">
                    <td class="first"><span id="table-property-maxpagestoshow">MaxPagesToShow</span></td>
                    <td><span id="table-property-maxpagestoshow-category">General Settings</span></td>
                    <td><span id="table-property-maxpagestoshow-type">Integer</span></td>
                    <td><span id="table-property-maxpagestoshow-description">Indicates the number of pages to display in the navigation panel. The default value is 7.</span></td>
                </tr>
                <tr class="classical">
                    <td class="first"><span id="table-property-enabletoppager">EnableTopPager</span></td>
                    <td><span id="table-property-enabletoppager-category">General Settings</span></td>
                    <td><span id="table-property-enabletoppager-type">Boolean</span></td>
                    <td><span id="table-property-enabletoppager-description">Indicates if the top pager is displayed. The default value is true.</span></td>
                </tr>
                <tr class="alternate">
                    <td class="first"><span id="table-property-enablebottompager">EnableBottomPager</span></td>
                    <td><span id="table-property-enablebottompager-category">General Settings</span></td>
                    <td><span id="table-property-enablebottompager-type">Boolean</span></td>
                    <td><span id="table-property-enablebottompager-description">Indicates if the bottom pager is displayed. The default value is true.</span></td>
                </tr>
                <tr class="classical">
                    <td class="first"><span id="table-property-autostart">AutoStart</span></td>
                    <td><span id="table-property-autostart-category">General Settings</span></td>
                    <td><span id="table-property-autostart-type">Boolean</span></td>
                    <td><span id="table-property-autostart-description">Indicates if the slideshow starts automatically. The default value is false.</span></td>
                </tr>
                <tr class="alternate">
                    <td class="first"><span id="table-property-displaypicturetitle">DisplayPictureTitle</span></td>
                    <td><span id="table-property-displaypicturetitle-category">General Settings</span></td>
                    <td><span id="table-property-displaypicturetitle-type">Boolean</span></td>
                    <td><span id="table-property-displaypicturetitle-description">Indicates if you want to display the picture's title. The default value is true.</span></td>
                </tr>
                <tr class="classical">
                    <td class="first"><span id="table-property-displaypicturedescription">DisplayPictureDescription</span></td>
                    <td><span id="table-property-displaypicturedescription-category">General Settings</span></td>
                    <td><span id="table-property-displaypicturedescription-type">Boolean</span></td>
                    <td><span id="table-property-displaypicturedescription-description">Indicates if you want to display the picture's description. The default value is true.</span></td>
                </tr>
                <tr class="alternate">
                    <td class="first"><span id="table-property-delay">Delay</span></td>
                    <td><span id="table-property-delay-category">Fx Settings</span></td>
                    <td><span id="table-property-delay-type">Integer</span></td>
                    <td><span id="table-property-delay-description">Indicates the transition delay during the slideshow in milliseconds. The default value is 2500.</span></td>
                </tr>
                <tr class="classical">
                    <td class="first"><span id="table-property-defaulttransitionduration">DefaultTransitionDuration</span></td>
                    <td><span id="table-property-defaulttransitionduration-category">Fx Settings</span></td>
                    <td><span id="table-property-defaulttransitionduration-type">Boolean</span></td>
                    <td><span id="table-property-defaulttransitionduration-description">Indicates the transition effects duration in milliseconds. The default value is 900.</span></td>
                </tr>
                <tr class="alternate">
                    <td class="first"><span id="table-property-preloadahead">PreloadAhead</span></td>
                    <td><span id="table-property-preloadahead-category">Fx Settings</span></td>
                    <td><span id="table-property-preloadahead-type">Boolean</span></td>
                    <td><span id="table-property-preloadahead-description"></span></td>
                </tr>
                <tr class="classical">
                    <td class="first"><span id="table-property-synctransitions">SyncTransitions</span></td>
                    <td><span id="table-property-synctransitions-category">Fx Settings</span></td>
                    <td><span id="table-property-synctransitions-type">Boolean</span></td>
                    <td><span id="table-property-synctransitions-description">Indicates if you want to use transitions. The default value is true.</span></td>
                </tr>
                <tr class="alternate">
                    <td class="first"><span id="table-property-onmouseoutopacity">OnMouseOutOpacity</span></td>
                    <td><span id="table-property-onmouseoutopacity-category">Fx Settings</span></td>
                    <td><span id="table-property-onmouseoutopacity-type">Number</span></td>
                    <td><span id="table-property-onmouseoutopacity-description">Indicates the mouse out opacity level. The value range is between 0 and 1. The default value is 0.1.</span></td>
                </tr>
                <tr class="classical">
                    <td class="first"><span id="table-property-mouseoveropacity">MouseOverOpacity</span></td>
                    <td><span id="table-property-mouseoveropacity-category">Fx Settings</span></td>
                    <td><span id="table-property-mouseoveropacity-type">Number</span></td>
                    <td><span id="table-property-mouseoveropacity-description">Indicates the mouse over opacity level. The value range is between 0 and 1. The default value is 1.</span></td>
                </tr>
                <tr class="alternate">
                    <td class="first"><span id="table-property-customcss">CustomCss</span></td>
                    <td><span id="table-property-customcss-category">General Settings</span></td>
                    <td><span id="table-property-customcss-type">String</span></td>
                    <td><span id="table-property-customcss-description">Indicates if you want to specify a custom CSS file URL.</span></td>
                </tr>
            </tbody>
        </table>
        
        <h2 id="more-information-and-support">More information and support</h2>

        <p id="help-footer">
            Because the program is licensed free of charge, there is no warranty for the program, to the extent permitted by applicable law.  
            Except when otherwise stated in writing the copyright holders and/or other parties provide the program "as is" without 
            warranty of any kind, either expressed or implied, including, but not limited to, the implied warranties of merchantability 
            and fitness for a particular purpose.  The entire risk as to the quality and performance of the program is with you.  
            Should the program prove defective, you assume the cost of all necessary servicing, repair or correction. 
            If you want to report a bug or a feature request, you can use the 
            <a href="https://gallerifficapp.codeplex.com/workitem/list/basic" target="_blank">Issue Tracker</a> of the Codeplex site. 
        </p>
    
    </div>

</asp:Content>


